import { useCallback } from 'react'
import { useAnimatedValue } from 'react-native'
import { appEnv } from '@/utils/inject'

const useNav = () => {
  const navOpacity = useAnimatedValue(0)

  const onScroll = useCallback(
    (e) => {
      const contentOffset = e.contentOffset || e.nativeEvent?.contentOffset
      const opacity = Math.min(1, Math.max(0, contentOffset?.y / (appEnv.statusBarHeight + appEnv.navBarHeight)))
      navOpacity.setValue(opacity)
    },
    [navOpacity],
  )

  return {
    navOpacity,
    onScroll,
  }
}

export default useNav
